<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@taglib prefix="mvc" uri="http://www.springframework.org/tags/form" %>
<%@taglib prefix="fmt" uri="http://www.springframework.org/tags" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>维修验库</title>
    <link rel="stylesheet" href="/lib/layui/layui/css/layui.css?20190817.1">
    <link rel="stylesheet" href="/lib/layui/layui/css/common.css">
    <link rel="stylesheet" href="/lims/css/eleTree.css">
    <script src="/lib/layui/layui/layui.js"></script>
    <script type="text/javascript" src="/lib/layui/layui/global.js"></script>
    <script type="text/javascript" src="../../js/jquery/jquery-1.9.1.js"></script>
    <script src="/lib/layui/layui/js/common.js?v=20190726" type="text/javascript" charset="utf-8"></script>
    <script src="../../js/base/base.js" type="text/javascript" charset="utf-8"></script>
    <script src="/lims/js/lrBase/base.js?v=201907311442" type="text/javascript" charset="utf-8"></script>
</head>
<style>
    /*.selects .layui-input{*/
        /*height: 30px;*/
    /*}*/
    /*.inp .layui-input{*/
        /*height: 30px;*/
    /*}*/
    .btn{
        width: 79px;
    }
    .layui-card-header {
        border-bottom: 1px solid #eee;
    }

    .mbox {
        padding: 8px;
    }

    .layui-btn {
        margin-left: 10px;
    }

    /*.layui-btn .layui-icon {*/
    /*margin-right: 0px;*/
    /*}*/

    .red {
        color: red;
        font-size: 16px;
    }

    #deptName td{
        padding: 0 10px 0 10px;
    }
    layui-nav-item, .layadmin-flexible {
        position: absolute;
        left: 5px;
        top: 23px;
        z-index: 9999999;
    }

    .bg {
        background-color: #F2F2F2;
    }

    .bgs {
        background-color: #F2F2F2;
    }

    .layui-table-view .layui-table td, .layui-table-view .layui-table th {
        padding: 3px 0;
    }
    .layui-input-block{
        margin-left: 94px;
    }
    .layui-form-label{
        width:100px;
        margin-left: -39px;
    }
    .rtfix{
        width:200px;
        /*overflow-x: scroll;*/
    }
    .layui-card-body{
        display: flex;
    }
    .layui-lf{
        min-width: 16%;
        overflow-x: auto;
        overflow-y:scroll;
        height: 600px !important;
    }
    .layui-rt{
        width: 84%;
        margin-left: 6px;
        margin-top: -5px;
    }
    .treeTitle{
        display: flex;
        box-sizing: border-box;
        justify-content: center;
        align-items: center;
        width: 100%;
        height: 30px;
        background-color: #00a0e9;
        color: #fff;
        padding: 15px;
        position: relative;
    }
    .layui-nav-item,.layadmin-flexible{
        position: absolute;
        left: 5px;
        top: 23px;
        z-index: 9999999;
    }
    .rtfix{
        width:200px;
        /*overflow-x: scroll;*/
    }
    .bg{
        background-color: #F2F2F2;
    }
    .bgs{
        background-color: #F2F2F2;
    }
    .back{
        background-color: #ccc;
    }
    .eleTree{
        cursor: pointer;
    }
    .layui-table-view .layui-table td, .layui-table-view .layui-table th{
        padding: 3px 0;
    }
    .layui-tab-title{
        height: 30px;
    }
    .layui-tab-title li{
        height: 36px;
        margin-top: -5px;
    }
    .active{
        display: none;
    }
    .back{
        background-color: #F2F2F2;
    }
    /*.layui-table-cell{*/
        /*position: relative;*/
    /*}*/
    /*.layui-table-cell .layui-form-checkbox[lay-skin=primary]{*/
        /*position: absolute;*/
        /*left: 50%;*/
        /*top: 50%;*/
        /*margin-left: -9px;*/
        /*margin-top: -9px;*/
    /*}*/
    .soul-table-child-patch{
        height: 0 !important;
    }
    .layui-table-view{
        margin: 5px 0;
    }
    .searchbtn{
        height: 35px;
        line-height: 35px;
        width: 80px;
        font-size: 17px;
    }
</style>
<body>
<div class="mbox">
    <div class="layui-card">
        <div class="layui-card-body" style="padding-left: 6px;">
            <div class="layui-lf rtfix">
                <div class="treeTitle" id="scoke" dataType="0" >物品分类
                </div>
                <div class="panel-body">
                    <div class="eleTree ele1" lay-filter="data1"></div>
                </div>
            </div>
            <div class="layui-rt" style="position: relative">
                <table class="layui-hide" id="test" lay-filter="test"></table>
            </div>
        </div>
    </div>
</div>
<%--数据表格--%>

<%--头部按钮--%>
<script type="text/html" id="toolbarDemo">

</script>
<%--操作按钮--%>
<script type="text/html" id="barDemo">
    <a class="layui-btn layui-btn-xs" lay-event="details">详情</a>
    <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
    <a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="dele">删除</a>
</script>
<%--表格头部--%>
<script type="text/html" id="toolbar">
    <div class="demoTable indexOne">

            <div class="layui-inline">
                <%--<div class="layui-btn-container" style="margin-bottom:0px">--%>
                    <button class="layui-btn layui-btn-sm " id="addExper" lay-event="getCheckData">新建经验</button>
                    <button class="layui-btn layui-btn-sm delete" lay-event="delete">批量删除</button>
                <%--</div>--%>
            </div>
        <div class="layui-inline">
                <label style="width:90px;margin-left: -18px;margin-top: 2px" class="layui-form-label">查询字段</label>
                <div class="layui-input-inline selects" style="width: 150px;">
                    <select class="layui-select options" name="cloum" autocomplete="off">
                        <option value="">请选择</option>
                        <option value="EXPER_NO">经验代码</option>
                        <option value="EQUIP_NAME">设备名称</option>
                        <option value="EQUIP_NO">固定资产编号</option>
                        <option value="EQUIP_TYPE_NAME">设备类型</option>
                        <option value="FACTORY_NO">出厂编号</option>
                        <option value="SPEC">规格</option>
                        <option value="MODEL_NO">型号</option>
                        <option value="FAULT_TYPE">现象分类</option>
                        <option value="FAULT_POSITION">发生部位</option>
                        <option value="FAULT_DESC">故障描述</option>
                    </select>
                </div>
                <div class="layui-input-inline inp" style="width: 150px;">
                    <input type="text" name="price_max" placeholder="请输入" autocomplete="off" class="layui-input">
                </div>
                <div class="layui-input-inline">
                    <a class="layui-btn layui-btn-sm searchbtn" data-type="reload" style="height: 30px;line-height: 30px">搜索</a>
                </div>
            </div>
    </div>
</script>
<script>
    var experId,
        trObj;
    layui.use(['table','form','layer','eleTree'], function(){
        var table = layui.table;
        var form = layui.form;
        var layer = layui.layer;
        var eleTree = layui.eleTree;
        var sele;
        var inpt;
        var tableIns;
        var pid;
        var equipIds;   //下拉数的id
        //        初始化渲染
        el = eleTree.render({
            elem: '.ele1',
            showLine: true,
            url: '/equipmentType/showParentEquipmentType',
            lazy: true,
            load: function (data, callback) {
                $.post('/equipmentType/showChildEquipmentType?equipTypeId=' + data.id, function (res) {
                    callback(res.data);//点击节点回调
                })

            },
            done: function (data) { //渲染完成回调
                aldata = data.data
                name = data.data[0].name //传的是默认选中的值
                pid = data.data[0].equipTypePid;
                //getTabke(data.data[0].id);
                idkey = data.data[0].id;
                equipids = data.data[0].id;
                //给左侧的下拉数据点击时添加的背景颜色
                var dataid = $('.ele1 div').attr("data-id")
                $('.eleTree-node').removeClass('back')
                $('.ele1 div[data-id=' + dataid + ']').addClass('back')
                $('.eleTree-node-group').css('background', '#fff')
                var aa = $(".mbox").find(".ele1 .eleTree-node").eq(0).attr("data-id");
            }

        });
        form.render();  //选人表单

        // 节点点击事件
        eleTree.on("nodeClick(data1)", function (d) {
            var dataid = $('.ele1 div').attr("data-id")
            var a = d.data.currentData.id;
            $('.eleTree-node').removeClass('back')
            $(d.node[0]).addClass('back')
            $('.eleTree-node-group').css('background', '#fff')
            var obj = d.data.currentData
            name = obj.name
            pid = obj.equipTypePid;
            idkey = obj.id;
            equipids = obj.id   //节点点击下拉数的id
            $.post('/equipmentType/showEquipmentTypeById?equipTypeId=' + obj.id, function (res) {
                var obj = res.data
                    , str;
            })
            var currentPage = 1
            tableIns.reload({
                url: '/experience/selectExperienceByEquipType',
                where:{
                    equipType:equipids
                }
               ,page: true
            })

        });


        //初始化表格
        tableIns= table.render({
            elem: '#test'
            ,url:'/experience/selectAllEquipmentExperience'
            ,toolbar: '#toolbar' //开启头部工具栏，并为其绑定左侧模板
            ,defaultToolbar: ['filter', 'exports', 'print', { //自定义头部工具栏右侧图标。如无需自定义，去除该参数即可
                title: '提示'
                ,layEvent: 'LAYTABLE_TIPS'
                ,icon: 'layui-icon-tips'
            }]
            ,page: { //支持传入 laypage 组件的所有参数（某些参数除外，如：jump/elem） - 详见文档
                layout: ['limit', 'count', 'prev', 'page', 'next', 'skip'] //自定义分页布局
                ,limits:[10,15,20,25,30,35,40,45,50]
                ,curr: 10 //设定初始在第 5 页
                ,first: false //不显示首页
                ,last: false //不显示尾页
            }
            ,title: '经验库表格'
            ,limit:10
            ,cols: [[
                {type: 'checkbox', fixed: 'left'}
                ,{field:'experNo', title:'经验代码',hide:true}
                ,{field:'equipName', title:'设备名称',minWidth:134}
                ,{field:'equipNo', title:'固定资产编号',minWidth:163}
                ,{field:'equipTypeName', title:'设备类型'}
                ,{field:'factoryNo', title:'出厂编号'}
                ,{field:'spec', title:'规格',hide:true}
                ,{field:'modelNo', title:'型号'}
                ,{field:'faultType', title:'现象分类',templet:function (b) {
                        if(b.codeName!=undefined){
                            return b.codeName
                        }else {
                            return b.faultType
                        }
                    }

                }
                ,{field:'faultPosition', title:'发生部位'}
                ,{field:'faultDesc', title:'故障描述'}
                ,{title:'操作',fixed:'right', toolbar: '#barDemo',width:180}
            ]]
            ,page: true
            ,done:function(res){
            }
        });

        table.on('tool(test)', function(res){
            var data = res.data; //获得当前行数据
            trObj=data;
            var layEvent = res.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
            var tr = res.tr;
            if(layEvent === 'dele'){
                publicDeleteEval('/experience/delExperienceByExperId',data.experId+',',tableIns,table);
            }else if(layEvent === "details"){
                layer.open({
                    type: 2 //此处以iframe举例
                    ,title: '详情'
                    ,area: ['100%', '100%']
                    ,maxmin: true
                    ,content: '/experience/goToAddExperience?btntype=details'
                    ,btn: ['取消']
                });
            }else if(layEvent === "edit"){
                layer.open({
                    type: 2 //此处以iframe举例
                    ,title: '编辑'
                    ,area: ['100%', '100%']
                    ,maxmin: true
                    ,content: '/experience/goToAddExperience?btnedit=edit'
                    ,btn: ['保存', '取消']
                    ,yes: function(index, layero){
                        layer.close(index);
                        //父页面获取子页面的方法 点击添加经验的页面
                        var experience = window["layui-layer-iframe" + index].addData();
                        $.ajax({
                            url:'/experience/editExperience',
                            type:'post',
                            dataType:'json',
                            data:experience,
                            success:function (res) {
                                layer.msg(res.msg)
                                tableIns.reload()
                            }
                        })
                    }
                });
            }
        })
        //头工具栏事件
        table.on('toolbar(test)', function(res){
            var checkStatus = table.checkStatus(res.config.id);
            switch(res.event){
                //删除事件
                case 'delete':
                    var data = checkStatus.data;
                    var arr='';
                   if(data.length<1){
                       layer.msg('请至少选择一条')
                   }else{
                        for(var i=0;i<data.length;i++){
                            arr += data[i].experId+','
                            // arr.push(data[i].experNo+',')
                        }
                        publicDeleteEval('/experience/delExperienceByExperId',arr,tableIns,table)
                   }
                    break;
                case 'template':
                    layer.open({
                        type: 2 //此处以iframe举例
                        ,title: '合同模板'
                        ,area: ['100%', '100%']
                        ,maxmin: true
                        ,content: '/template/index'
                        ,btn: ['保存', '取消']
                        ,yes: function(index, layero){

                        }
                    });
                    break;
                case 'getCheckData':
                    if (pid == 0) {
                        layer.msg("一级类别下无法添加");
                        return false;
                    } else {
                        layer.open({
                            type: 2 //此处以iframe举例
                            , title: '添加经验'
                            , area: ['100%', '100%']
                            , maxmin: true
                            , content: '/experience/goToAddExperience?addbttn=getCheckData'
                            , btn: ['保存', '取消']
                            , yes: function (index, layero) {
                                layer.close(index);
                                //父页面获取子页面的方法 点击添加经验的页面
                                var experience = window["layui-layer-iframe" + index].addData();
                                $.ajax({
                                    url: '/experience/addExperience'
                                    , type: 'post'
                                    , dataType: 'json'
                                    , data: experience
                                    , success: function (res) {
                                        layer.msg(res.msg)
                                        tableIns.reload()
                                    }
                                })
                            }
                        });
                    }
                    break;
            };
        });

        //监听行事件
        table.on('row(test)', function(res){
            experId = res.data.experId
        });
        // 搜索功能
        $(document).on('click','.searchbtn',function () { //重载表格
            sele =  $('.options').val()
            inpt = $("input[name='price_max']").val()
             if(sele==""&&inpt!=""){
                layer.msg("请选择查询条件",{time:1000})
            }else if(sele==""&&inpt==""){
                tableIns.reload({
                    page: {curr: 1},
                    url: '/experience/selectAllEquipmentExperience'

                })
            }else{
                tableIns.reload({
                    page:{ curr:1 },
                    where:{
                        fieldName:sele,
                        fieldValue:inpt
                    },
                    url:'/experience/selectExperienceByName'
                    ,done:function(res){//done函数 搜索后回显搜素条件
                        $(".indexOne input[name='price_max']").val(inpt);  //输入框
                        $(".indexOne").find("select[name='cloum']").each(function() {
                            // this代表的是<option></option>，对option再进行遍历
                            $(this).children("option").each(function() {
                                // 判断需要对那个选项进行回显
                                if(this.value == sele) {
                                    // 进行回显
                                    $(this).attr("selected","selected");
                                }
                            });
                        });
                        form.render('select');
                    }
                })
            }
        })
        //回车实现搜索
        //下面方法兼容谷歌，火狐，ie:
        document.onkeydown = function (e) {
            var theEvent = window.event || e;
            var code = theEvent.keyCode || theEvent.which;
            if (code == 13) {
                $('.searchbtn').click();
            }
        };
    });

    //刪除页数最后一条数据自动返回上一页
    function publicDeleteEval(url,ids,tableIns,table){
        layer.confirm('确定要删除吗?', {icon: 3, title:'提示'}, function(index){
            var data={
                experIds:ids
            }
            var res=toAjaxT(url,data);
            layer.msg(res.msg)
            if(res.code==0){
                try {
                    if (ids.substring(ids.length - 1) == ",") {
                        ids = ids.substring(0, ids.length - 1);
                    }
                    var dataSize = ids.split(",");
                    var dataAll = table.cache[tableIns.config.id];
                    if (dataAll.length == dataSize.length) {
                        //得到当前页
                        var page = $(".layui-laypage-skip .layui-input").val();

                        if (page > 1) {
                            tableIns.reload({
                                page: {
                                    curr: page - 1 //重新从第 1 页开始
                                }}
                            );
                        }else{
                            tableIns=tableIns.reload();
                        }
                    } else {
                        tableIns=tableIns.reload();
                    }
                } catch (e) {
                    tableIns.reload();
                }
            }
            layer.close(index);
        });
    }
    //同步
    function toAjaxT(url,data) {
        var result;
        $.ajax({
            url:url,
            data:data,
            type: 'post',
            async:false,
            dataType: 'json',
            success: function (res){
                result=res;
            }
        });
        return result;
    }

    function undefind_nullStr(value) {
        if(value==undefined){
            return ""
        }
        return value
    }
</script>
</body>


</html>